<template>
	<view class="main">
		<uni-nav-bar @clickLeft="back" left-icon="left" :title="toptitle+'详情'" background-color="#007AFF" color="#000"
			statusBar="true"></uni-nav-bar>

		<scroll-view class="scrollView" scroll-y="true" @scrolltolower="handleScrolltolowerone()"
			:style="{height: setcollapseheight() + 'px'}">

			<view class="itemBox">
				<view class="itemContent">
					<view class="itemTitle">合同编号:</view>
					<view class="itemValue">{{formData.contractNo||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同名称:</view>
					<view class="itemValue">{{formData.contractName||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同详情:</view>
					<view class="itemValue">{{formData.contractDetail||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同协定数量:</view>
					<view class="itemValue">{{formData.agreementNum||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同甲方:</view>
					<view class="itemValue">{{formData.partA||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同乙方:</view>
					<view class="itemValue">{{formData.partB||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同签订时间:</view>
					<view class="itemValue">{{formData.signDate||'--'}}</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同有效年限:</view>
					<view class="itemValue">{{formData.effectiveYear||'--'}}
					</view>
				</view>
				<view class="itemContent">
					<view class="itemTitle">合同文件:</view>
					<view v-for="item,index in formData.contractFileList" class="itemValue">
						{{item.fileName||'--'}}
						<span @click="Download(item)"
							style="padding: 10rpx 20rpx;background-color:#007aff;color: #fff;border-radius: 20rpx;margin-left: 20rpx;">下载</span>
					</view>
					<view v-show="formData.contractFileList&&!formData.contractFileList.length" class="itemValue">暂无合同文件
					</view>
				</view>

			</view>
		</scroll-view>



	</view>
</template>

<script>
	import API from '@/api/socialized-servce/index-message/index.js'
	export default {
		components: {

		},
		data() {
			return {
				page: 1,
				size: 10,
				total: 0,
				totalPages: 0,
				loading: false,
				postList: [],
				formData: {},
				toptitle: '',
				modalTilte: '',
				modalshow: false,
				reason: '',
			}
		},
		onLoad(e) {
			if (Object.keys(e).length) {
				this.formData = JSON.parse(e.data)
			}
		},
		mounted() {
			this.setcollapseheight()
			// this.getWaitPostList()
		},
		methods: {
			//签订合同下载
			Download(item) {
				uni.downloadFile({
					url: item.fileUrl,
					success: (data) => {
						if (data.statusCode === 200) {
							//文件保存到本地
							uni.saveFile({
								tempFilePath: data.tempFilePath, //临时路径
								success: function(res) {
									uni.showToast({
										icon: 'none',
										mask: true,
										title: '文件已保存：' + res.savedFilePath, //保存路径
										duration: 3000,
									});
									setTimeout(() => {
										//打开文档查看
										uni.openDocument({
											filePath: res.savedFilePath,
											success: function(res) {
												// console.log('打开文档成功');
											}
										});
									}, 3000)
								}
							});
						}
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '失败请重新下载',
						});
					},
				});
			},



			async getWaitPostList() {
				if (this.loading) return
				this.loading = true
				let params = {
					page: this.page,
					size: this.size
				}
				let res = await API.getWaitPostList(params)
				if (res.code === 200) {
					this.total = res.data.totalElements
					this.totalPages = res.data.totalPages
					let newList = res.data.content
					if (this.page === 1) {
						this.postList = newList
					} else {
						this.postList = [...this.postList, ...newList]
					}
					// this.postList.forEach(el=>{
					// 	if(el.brief !== null) {
					// 		el.brief = el.brief.split(';')
					// 	}
					// })
					this.loading = false
				}
			},
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
			setcollapseheight() {
				let topheightone = uni.upx2px(36)
				let winHeight = 0
				uni.getSystemInfo({
					success: function(res) {
						winHeight = res.windowHeight
					}
				});
				let oldHeight = uni.upx2px(56)

				winHeight = parseInt(winHeight) - topheightone - oldHeight
				// #ifndef H5
				winHeight = winHeight - 20

				// #endif
				return winHeight
			},
			handleScrolltolowerone() {
				if (this.loading) return;
				console.log('触底', this.page, this.totalPages);
				if (this.page <= this.totalPages && this.page * 10 < this.total) {
					this.page++
					this.getWaitPostList()
				}
			},
		}

	}
</script>

<style lang="scss" scoped>
	.scrollView {
		padding: 30rpx 30rpx 0rpx;
		box-sizing: border-box;
	}

	.itemBox {
		margin: 10rpx auto 0rpx;
		padding: 12rpx 30rpx;
		box-sizing: border-box;
		margin: 0 auto;
		width: 100%;
		min-height: 85vh;
		opacity: 1;
		border-radius: 16rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0rpx 0rpx 12rpx rgba(0, 0, 0, 0.05);

		.itemContent {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			flex-wrap: wrap;
			min-height: 80rpx;
			line-height: 80rpx;
			font-size: 28rpx;
			font-weight: 400;
			letter-spacing: 0rpx;
			color: rgba(39, 39, 39, 1);
			border-bottom: 2rpx solid rgba(235, 235, 235, 1);

		}

		.itemTitle {
			min-width: 250rpx;
		}

		.itemValue {
			width: 350rpx;
		}

		.lookDetail {
			border-radius: 20rpx;
			box-sizing: border-box;
			width: 150rpx;
			height: 60rpx;
			line-height: 60rpx;
			text-align: center;
			background-color: #84a9ff;
			border: 2rpx solid #5555ff;
			color: #fff;

		}
	}

	.contant {}

	.popup-photo {
		width: 80vw;
		height: 80vh;
	}

	.btnBox {
		width: 100%;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		flex-wrap: wrap;
		color: #ffffff;
		margin-top: 20rpx;

		.lookClose,
		.lookCompleted,
		.review,
		.del {
			min-width: 140rpx;
			height: 58rpx;
			line-height: 58rpx;
			border-radius: 30rpx;
			padding: 4rpx 12rpx;
			text-align: center;
			margin-left: 8rpx;
			background: linear-gradient(270deg, rgba(136, 172, 255, 1) 0%, rgba(33, 101, 255, 1) 100%);

		}

		.lookCompleted {}

		.del {
			background: linear-gradient(270deg, rgba(249, 170, 170, 1) 0%, rgba(255, 108, 108, 1) 100%);
		}
	}
</style>